<template>
  <div class="#app">
    <el-card>
      <!-- 2.1 顶部操作 -->

      <el-row :gutter="20">
        <el-col :span="20">
          <!-- 使用clearable属性即可得到一个可清空的输入框   clear	在点击由 clearable 属性生成的清空按钮时触发-->
          <!-- <el-input placeholder="请输入内容" v-model="queryInfo.floorId" class="input-with-select"  clearable @clear="getList">
            <template #append>
              <el-button icon="el-icon-search" @click="getList"></el-button>
            </template>
          </el-input> -->
          <el-form :inline="true" :model="queryInfo" class="demo-form-inline">
            <el-form-item label="姓名">
              <el-input
                v-model="queryInfo.name"
                placeholder="姓名"
                clearable
                @clear="getList"
              ></el-input>
            </el-form-item>
            <el-form-item label="编号">
              <div>
                <el-input
                  v-model="queryInfo.roomId"
                  placeholder="编号"
                  clearable
                  @clear="getList"
                ></el-input>
              </div>
            </el-form-item>

            <el-form-item label="类型">
              <!-- <el-input v-model="queryInfo.roomType" placeholder="类型"></el-input> -->

              <el-select
                v-model="queryInfo.roomType"
                placeholder="类型"
                clearable
                @clear="getList"
                @change="getList"
              >
                <el-option
                  v-for="item in roomTypeList"
                  :key="item.id"
                  :label="item.type"
                  :value="item.id"
                >
                </el-option>
              </el-select>
            </el-form-item>

            <el-form-item>
              <el-button icon="el-icon-search" type="primary" @click="getList"
                >查询</el-button
              >
              <el-button
                icon="el-icon-edit"
                type="primary"
                @click="showAddDialog"
                >登记入住</el-button
              >
            </el-form-item>
          </el-form>
        </el-col>
        <el-col :span="4">
          <!-- <el-button type="primary" @click="showAddDialog">添加</el-button> -->
          <!-- <el-button type="primary" @click="deleteWithArr(multipleSelection)">批量删除</el-button> -->
        </el-col>
      </el-row>

      <el-table
        :data="list"
        border
        stripe
        @selection-change="handleSelectionChange"
      >
        >
        <!-- 索引列 -->
        <el-table-column type="selection" width="60"></el-table-column>
        <el-table-column type="index" label="序号" width="60"></el-table-column>
        <!-- <el-table-column label="ID" prop="id"></el-table-column> -->
        <el-table-column label="入住人" prop="name"></el-table-column>
        <el-table-column label="编号" prop="roomId"></el-table-column>
        <el-table-column label="类型" prop="roomType">
          <template slot-scope="{ row }">
            {{ typeList[row.roomType - 1] }}
          </template>
        </el-table-column>
        <el-table-column
          label="早餐服务"
          prop="breakfastServed"
          :formatter="breakfastServedFmr"
        ></el-table-column>
        <!-- <el-table-column label="入住时间">
          <template slot-scope="{row}">
            <span>{{ row.createdTime | dateFormat }}</span>
          </template>
        </el-table-column> -->
        <!-- 自定义列 -->
        <el-table-column label="操作" width="180px">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="primary"
              icon="el-icon-edit"
              @click="showEditDialog(scope.row.id)"
              >编辑
            </el-button>
            <!-- <el-button size="mini" type="danger" icon="el-icon-delete" @click="removeById(scope.row.id)">删除
            </el-button> -->
            <!-- {{scope.row}} -->
          </template>
        </el-table-column>
      </el-table>

      <!-- 2.3 分页 -->

      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="queryInfo.pageNum"
        :page-size="queryInfo.pageSize"
        :page-sizes="[5, 10, 20, 40]"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>
    </el-card>
    <!-- 3.弹框区域 -->

    <!-- 添加框 -->
    <!-- modify -->
    <el-dialog
      title="添加"
      :visible.sync="addDialogVisible"
      width="50%"
      @close="addDialogClosed"
    >
      <el-form
        :model="addForm"
        ref="addFormRef"
        :rules="addFormRules"
        label-width="100px"
      >
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="房间类型">
              <el-select
                v-model="addForm.roomType"
                class="filter-item"
                placeholder="房间类型"
                @change="getRooms(addForm.roomType)"
              >
                <el-option
                  v-for="item in roomTypeList"
                  :key="item.id"
                  :label="item.type"
                  :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="房间编号">
              <el-select
                v-model="addForm.roomId"
                class="filter-item"
                placeholder="房间编号"
                @change="chooseRoomPriceInAdd(addForm.roomId)"
              >
                <el-option
                  v-for="item in rooms"
                  :key="item.id"
                  :label="item.roomId"
                  :value="item.roomId"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="8">
            <el-form-item label="入住人数" prop="checkinNumber">
              <el-input
                v-model="addForm.checkinNumber"
                @input="modifyPeopleInAdd(addForm.checkinNumber)"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="订金" prop="deposit">
              <el-input v-model="addForm.deposit">
                <template slot="prepend">￥</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否需要早餐">
              <el-radio-group v-model="addForm.breakfastServed">
                <el-radio :label="1">是</el-radio>
                <el-radio :label="0">否</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="会员Id" prop="memberId ">
              <el-input v-model="addForm.memberId"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系方式" prop="contactTel ">
              <el-input v-model="addForm.contactTel"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <!-- asdgagsdhash -->
        <el-form-item
          :label="'入住人' + (index + 1)"
          v-for="(people, index) in addForm.peopleList"
          :key="index"
        >
          <el-row>
            <el-col :span="4">
              <el-form-item>
                <el-input
                  v-model="people.name"
                  placeholder="请输入姓名"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="20">
              <el-input
                placeholder="请输入证件号码"
                v-model="people.idNumber"
                class="input-with-select"
              >
                <el-select
                  v-model="people.idType"
                  slot="prepend"
                  placeholder="请选择证件类型"
                  style="width: 160px"
                >
                  <el-option
                    v-for="(item, index) in idType"
                    :key="index"
                    :label="item"
                    :value="index"
                  ></el-option>
                </el-select>
              </el-input>
            </el-col>
          </el-row>
        </el-form-item>

        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="时间">
              <el-date-picker
                v-model="timeInAdd"
                type="daterange"
                range-separator="-"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                @change="timeChangeInAdd"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="操作员" prop="operator">
              <el-input v-model="addForm.operator"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="24">
          <el-form-item label="房价">
            <el-col :span="16">
              <el-radio-group
                v-model="choosePrice"
                size="medium"
                @change="chooseRoomPrice_addForm()"
              >
                <el-radio-button label="标准价格"></el-radio-button>
                <el-radio-button label="折后价格"></el-radio-button>
                <el-radio-button label="普通会员价"></el-radio-button>
                <el-radio-button label="vip会员价"></el-radio-button>
              </el-radio-group>
            </el-col>
            <el-col :span="8">
              <el-input
                v-model="addForm.roomPrice"
                disabled
                class="price-view"
              >
                <template slot="prepend">￥</template>
              </el-input>
            </el-col>
          </el-form-item>
        </el-row>
        <el-form-item label="总金额">
          <el-input v-model="addForm.totalPrice" disabled class="price-view">
            <template slot="prepend" style="color: #ebf24e">￥</template>
          </el-input>
        </el-form-item>

      </el-form>
      <!-- 底部 -->
      <span slot="footer" class="dialog-footer">
        <el-button @click="addDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="checkInWithRoomChange">确 定</el-button>
        <!-- <el-button type="primary" @click="consoleLog">dddddddddddd</el-button> -->
      </span>
    </el-dialog>
    <!-- 编辑框 -->
    <!-- modify -->
    <el-dialog
      title="编辑"
      :visible.sync="editDialogVisible"
      width="50%"
      @close="editDialogClosed"
    >
      <el-form
        :model="editForm"
        ref="editFormRef"
        :rules="editFormRules"
        label-width="100px"
      >
        <!-- <el-form
          :model="editForm"
          ref="editFormRef"
          :rules="editFormRules"
          label-width="100px"
        > -->
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="房间类型">
              <el-select
                v-model="editForm.roomType"
                class="filter-item"
                placeholder="Please select"
                @change="getRooms(editForm.roomType)"
              >
                <el-option
                  v-for="item in roomTypeList"
                  :key="item.id"
                  :label="item.type"
                  :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="房间编号">
              <el-select
                v-model="editForm.roomId"
                class="filter-item"
                placeholder="Please select"
                @change="chooseRoomPrice(editForm.roomId)"
              >
                <el-option
                  v-for="item in rooms"
                  :key="item.id"
                  :label="item.roomId"
                  :value="item.roomId"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="24">
          <el-col :span="8">
            <el-form-item label="入住人数" prop="checkinNumber">
              <el-input
                v-model="editForm.checkinNumber"
                @input="modifyPeople(editForm.checkinNumber)"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="订金" prop="deposit">
              <el-input v-model="editForm.deposit">
                <template slot="prepend">￥</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否需要早餐">
              <el-radio-group v-model="editForm.breakfastServed">
                <el-radio :label="1">是</el-radio>
                <el-radio :label="0">否</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="会员Id" prop="memberId ">
              <el-input v-model="editForm.memberId"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系方式" prop="contactTel ">
              <el-input v-model="editForm.contactTel"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-form-item
          :label="'入住人' + (index + 1)"
          v-for="(people, index) in editForm.peopleList"
          :key="index"
        >
          <el-row>
            <el-col :span="4">
              <el-form-item>
                <el-input
                  v-model="people.name"
                  placeholder="请输入姓名"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="20">
              <el-input
                placeholder="请输入证件号码"
                v-model="people.idNumber"
                class="input-with-select"
              >
                <el-select
                  v-model="people.idType"
                  slot="prepend"
                  placeholder="请选择证件类型"
                  style="width: 160px"
                >
                  <el-option
                    v-for="(item, index) in idType"
                    :key="index"
                    :label="item"
                    :value="index"
                  ></el-option>
                </el-select>
              </el-input>
            </el-col>
          </el-row>
        </el-form-item>

        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="时间">
              <el-date-picker
                v-model="time"
                type="daterange"
                range-separator="-"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                @change="timeChange"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="操作员" prop="operator">
              <el-input v-model="editForm.operator"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="24">
          <el-form-item label="房价">
            <el-col :span="16">
              <el-radio-group
                v-model="choosePrice"
                size="medium"
                @change="chooseRoomPrice()"
              >
                <el-radio-button label="标准价格"></el-radio-button>
                <el-radio-button label="折后价格"></el-radio-button>
                <el-radio-button label="普通会员价"></el-radio-button>
                <el-radio-button label="vip会员价"></el-radio-button>
              </el-radio-group>
            </el-col>
            <el-col :span="8">
              <el-input
                v-model="editForm.roomPrice"
                disabled
                class="price-view"
              >
                <template slot="prepend">￥</template>
              </el-input>
            </el-col>
          </el-form-item>
        </el-row>
        <el-form-item label="总金额">
          <el-input v-model="editForm.totalPrice" disabled class="price-view">
            <template slot="prepend" style="color: #ebf24e">￥</template>
          </el-input>
        </el-form-item>
      </el-form>
      <!-- 底部 -->
      <span slot="footer" class="dialog-footer">
        <el-button @click="editDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="update()">确认更换</el-button>
        <!-- <el-button type="primary">暂时保存</el-button> -->
        <!-- <el-button type="primary" @click="consoleLog">dddddddddddd</el-button> -->
      </span>
    </el-dialog>
  </div>
</template>
<script>
import {
  fecthList,
  add,
  update,
  deleteOne,
  deleteByIds,
  getById,
  getRoomType,
  getRooms,
} from "../../api/roomChangeManagement";
export default {
  data() {
    return {
      queryInfo: {
        name: null,
        roomId: null,
        roomType: null,
        pageNum: 1,
        pageSize: 10,
      },
      list: [],
      total: 0,

      addDialogVisible: false,
      adddialog: [],
      // modify
      addForm: {
        roomId: null,
        roomType: null,
        roomPrice: null,
        deposit: null,
        contactTel: null,
        arrivedTime: null,
        departureTime: null,
        checkinNumber: null,
        operator: null,
        memberId: null,
        totalPrice: null,
        breakfastServed: null,
        peopleList: [],
        remarks: "",
      },

      timeInAdd: [],

      // modify
      addFormRules: {
        floorName: [
          { required: true, message: "楼层名称", trigger: "blur" },
          { min: 1, max: 5, message: "长度在 1 到 5 个字符", trigger: "blur" },
        ],
        floorId: [{ required: true, message: "请输入摘要", trigger: "blur" }],
        remarks: [{ required: true, message: "请输入摘要", trigger: "blur" }],
      },

      editDialogVisible: false,
      // modify
      editForm: {},
      // modify
      editFormRules: {},

      ids: [],
      multipleSelection: [],

      // 房间类型数组
      roomTypeList: [],
      typeList: [],
      rooms: [],
      time: [],
      choosePrice: "",
      idType: ["中国居民身份证", "外国人永久居留身份证", "港澳台居民居住证"],
    };
  },
  created() {
    this.getList();
    this.getAllRoomType();
  },
  //方法
  methods: {
    //查询  async  await
    getList() {
      //{k1:v1,k2:v2}  ---> ?k1=v1&k2=v2    query=&pagenum=1&pagesize=10
      fecthList(this.queryInfo).then((response) => {
        this.list = response.data.records;
        this.total = response.data.total;
      });
    },

    getAllRoomType() {
      getRoomType().then((res) => {
        this.roomTypeList = res.data;
        //console.log("房间类型：" + this.roomTypeList[0].type)
        this.roomTypeList.forEach((element) => {
          //console.log(element.type)
          this.typeList.push(element.type);
          //console.log(this.typeList[0])
        });
      });
    },

    getRooms(roomType) {
      getRooms(roomType).then((res) => {
        this.rooms = res.data;
        this.editForm.roomId = this.rooms[0].roomId;
        this.addForm.roomId = this.rooms[0].roomId;
        this.addForm.roomPrice = this.rooms[0].standPrice
        this.editForm.roomPrice = this.rooms[0].standPrice
        // this.addReserveForm.roomId = this.rooms[0].roomId;
      });
    },



    // 早餐服务格式化
    breakfastServedFmr(row, column, cellValue) {
      if (cellValue == 0) {
        return <el-tag>未预定</el-tag>;
      } else if (cellValue == 1) {
        return <el-tag type="success">已预定</el-tag>;
      }
    },

    //分页
    handleSizeChange(val) {
      //console.log(`每页 ${val} 条`);
      this.queryInfo.pageSize = val;
      this.getList();
    },
    handleCurrentChange(val) {
      //console.log(`当前页: ${val}`);
      this.queryInfo.pageNum = val; // 获取新页码
      this.getList();
    },

    //添加
    //弹框
    showAddDialog() {
      this.addDialogVisible = true;
    },

    checkInWithRoomChange() {
      this.$refs.addFormRef.validate(async (valid) => {
        //console.log(valid);

        if (!valid) return;

        //console.log(this.addForm);

        add(this.addForm)
          .then((response) => {
            this.addDialogVisible = false;
            if (response.status === 200) {
              this.$notify({
                title: "成功",
                message: "添加成功",
                type: "success",
                duration: 1000,
              });
            } else {
              this.$notify({
                title: "失败",
                message: "添加失败",
                type: "error",
                duration: 1000,
              });
            }
            this.getList();
          })
          .catch(() => {
            this.$notify({
              title: "失败",
              message: "请确保楼层号不重复！",
              type: "error",
              duration: 1000,
            });
          });
      });
    },

    // @close="addDialogClosed"
    addDialogClosed() {
      //console.log(this.$refs); //可以获取所有带ref属性的元素
      this.$refs.addFormRef.resetFields(); //清空表单
      this.timeInAdd = []
    },
    consoleLog() {
      console.log("editForm", this.editForm);
      console.log(this.addForm)
    },

    // initChoosePrice(roomPrice){

    // },

    //更新
    showEditDialog(id) {
      console.log("获取的id：" + id);
      getById(id)
        .then((response) => {
          if (response.status != 200) {
            return this.$message.error("查询信息失败！");
          } else {
            this.editForm = response.data; // 对象复制
            this.time.push(this.editForm.arrivedTime);
            this.time.push(this.editForm.departureTime);
            // console.log("获取的response.data：" + this.$qs.stringify(response.data));
            getRooms(this.editForm.roomType).then((res) => {
              this.rooms = res.data;
              // this.editForm.roomId = this.rooms[0].roomId;
              // this.addReserveForm.roomId = this.rooms[0].roomId;
            });
            this.editDialogVisible = true;
          }
        })
        .catch(() => {
          return this.$message.error("获取失败");
        });
    },
    update() {
      this.$refs.editFormRef.validate(async (valid) => {
        if (!valid) return;
        update(this.editForm).then((response) => {
          // const index = this.list.findIndex(v => v.id === this.editForm.id)
          // this.list.splice(index, 1, this.editForm)
          if (response.status === 200) {
            this.$notify({
              title: "修改成功",
              type: "success",
              duration: 1200,
            });
            // console.log("放给后端修改的数据：" + this.$qs.stringify(this.editForm))
            this.consoleLog();
            this.getList();
          } else {
            return this.$message.error("修改失败");
          }
        });
        // 关闭对话框
        this.editDialogVisible = false;
      });
    },

    editDialogClosed() {
      this.$refs.editFormRef.resetFields();
      this.time = [];
    },

    modifyPeople(num) {
      let listLength = this.editForm.peopleList.length;
      console.log("l", listLength);
      for (var i = listLength; i < num; i++) {
        this.editForm.peopleList.push({
          idType: 0,
          idNumber: "",
          name: "",
        });
      }
      console.log(this.editForm.peopleList);
      if (num < listLength) {
        for (var i = num; i < listLength; i++) {
          this.editForm.peopleList.splice(i, 1);
        }
        console.log(this.editForm.peopleList);
      }
    },

    // 添加框中添加身份信息
    modifyPeopleInAdd(num) {
      let listLength = this.addForm.peopleList.length;
      console.log("l", listLength);
      for (var i = listLength; i < num; i++) {
        this.addForm.peopleList.push({
          idType: 0,
          idNumber: "",
          name: "",
        });
      }
      console.log(this.addForm.peopleList);
      if (num < listLength) {
        for (var i = num; i < listLength; i++) {
          this.addForm.peopleList.splice(i, 1);
        }
        console.log(this.addForm.peopleList);
      }
    },

    removeById(id) {
      this.$confirm("此操作将永久删除数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          // this.ids.push(id)
          // 删除逻辑
          deleteOne(id).then((res) => {
            if (res.status === 200) {
              this.$notify({
                title: "成功",
                message: "删除成功",
                type: "success",
                duration: 1200,
              });
            } else {
              return this.$message.error("删除失败");
            }

            this.getList();
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },

    handleSelectionChange(val) {
      this.multipleSelection = val;
      console.log(this.multipleSelection);
    },
    deleteWithArr(val) {
      val.forEach((element) => {
        this.ids.push(element.id);
      });
      console.log("ids：" + this.ids);

      deleteByIds(this.ids).then((res) => {
        if (res.status === 200) {
          this.$notify({
            title: "成功",
            message: "删除成功",
            type: "success",
            duration: 1200,
          });
        } else {
          return this.$message.error("删除失败！");
        }
        this.getList();
      });
    },
    timeChange() {
      // console.log("time",this.time)
      this.editForm.arrivedTime = this.time[0];
      this.editForm.departureTime = this.time[1];
      var dateBegin = new Date(this.editForm.arrivedTime);
      var dateEnd = new Date(this.editForm.departureTime);
      var dateDiff = dateEnd.getTime() - dateBegin.getTime(); //时间差的毫秒数
      var dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000));
      this.editForm.totalPrice = this.editForm.roomPrice * dayDiff;
    },
    timeChangeInAdd() {
      console.log("time",this.time)
      this.addForm.arrivedTime = this.timeInAdd[0];
      this.addForm.departureTime = this.timeInAdd[1];
      var dateBegin = new Date(this.addForm.arrivedTime);
      var dateEnd = new Date(this.addForm.departureTime);
      var dateDiff = dateEnd.getTime() - dateBegin.getTime(); //时间差的毫秒数
      var dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000));
      this.addForm.totalPrice = this.addForm.roomPrice * dayDiff;
    },
    chooseRoomPrice() {
      var dateBegin = new Date(this.editForm.arrivedTime);
      var dateEnd = new Date(this.editForm.departureTime);
      var dateDiff = dateEnd.getTime() - dateBegin.getTime(); //时间差的毫秒数
      var dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000));
      switch (this.choosePrice) {
        case "标准价格":
          this.editForm.roomPrice = this.rooms[0].standPrice;
          this.editForm.totalPrice = this.editForm.roomPrice * dayDiff;
          // console.log(this.editForm.roomPrice)
          break;
        case "折后价格":
          this.editForm.roomPrice = this.rooms[0].discountPrice;
          this.editForm.totalPrice = this.editForm.roomPrice * dayDiff;
          break;
        case "普通会员价":
          this.editForm.roomPrice = this.rooms[0].standMemberPrice;
          this.editForm.totalPrice = this.editForm.roomPrice * dayDiff;
          break;
        case "vip会员价":
          this.editForm.roomPrice = this.rooms[0].vipMemberPrice;
          this.editForm.totalPrice = this.editForm.roomPrice * dayDiff;
          break;
        default:
          break;
      }
    },
    chooseRoomPrice_addForm() {
      var dateBegin = new Date(this.addForm.arrivedTime);
      var dateEnd = new Date(this.addForm.departureTime);
      var dateDiff = dateEnd.getTime() - dateBegin.getTime(); //时间差的毫秒数
      var dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000));
      switch (this.choosePrice) {
        case "标准价格":
          this.addForm.roomPrice = this.rooms[0].standPrice;
          this.addForm.totalPrice = this.addForm.roomPrice * dayDiff;
          console.log(this.addForm.roomPrice)
          console.log(this.addForm)
          break;
        case "折后价格":
          this.addForm.roomPrice = this.rooms[0].discountPrice;
          this.addForm.totalPrice = this.addForm.roomPrice * dayDiff;
          break;
        case "普通会员价":
          this.addForm.roomPrice = this.rooms[0].standMemberPrice;
          this.addForm.totalPrice = this.addForm.roomPrice * dayDiff;
          break;
        case "vip会员价":
          this.addForm.roomPrice = this.rooms[0].vipMemberPrice;
          this.addForm.totalPrice = this.addForm.roomPrice * dayDiff;
          break;
        default:
          break;
      }
    },
    chooseRoomPriceInAdd() {
      var dateBegin = new Date(this.addForm.arrivedTime);
      var dateEnd = new Date(this.addForm.departureTime);
      var dateDiff = dateEnd.getTime() - dateBegin.getTime(); //时间差的毫秒数
      var dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000));
      switch (this.choosePrice) {
        case "标准价格":
          this.addForm.roomPrice = this.rooms[0].standPrice;
          this.addForm.totalPrice = this.addForm.roomPrice * dayDiff;
          console.log("标准价格："+this.addForm.roomPrice)
          break;
        case "折后价格":
          this.addForm.roomPrice = this.rooms[0].discountPrice;
          this.addForm.totalPrice = this.addForm.roomPrice * dayDiff;
          break;
        case "普通会员价":
          this.addForm.roomPrice = this.rooms[0].standMemberPrice;
          this.addForm.totalPrice = this.addForm.roomPrice * dayDiff;
          break;
        case "vip会员价":
          this.addForm.roomPrice = this.rooms[0].vipMemberPrice;
          this.addForm.totalPrice = this.addForm.roomPrice * dayDiff;
          break;
        default:
          break;
      }
    },

  },
};
</script>
<style scoped>
.el-card {
  margin-top: 15px;
}

.el-table {
  margin-top: 15px;
  margin-bottom: 15px;
}
</style>
